<template>
  <div class="homeBefore" style="overflow:hidden">
    <div style="position: relative;width:100%;height:50px;">
      <van-nav-bar
        fixed
        title="大熊贷款"
      />
    </div>
    <van-pull-refresh style="height:100%" v-model="isLoading" @refresh="onRefresh">
      <!-- 0，10 -1显示 -->
    <div v-if="borrowing.state==0||borrowing.state==10||borrowing.state==-1">
      <van-swipe class="my-swipe" :autoplay="3000" indicator-color="#43A4FF" >
          <van-swipe-item v-for="item in adDate" :key="item.id">
             <!-- :href="item.targetPath" -->
            <a @click="aHref(item.targetPath,item.title)"><img width="100%" height="100%" :data-id="item.id" :src="item.imgPath" :alt="item.title"></a>
          </van-swipe-item>
      </van-swipe>
      <div class="core-function">
        <!-- 有文字广告显示，无隐藏pageTopRollTipList -->
        <div class="hint" v-if="pageTopRollTipList">
          <i class="iconfont icon-laba"></i>
          <van-swipe class="carousel" :autoplay="3000" vertical :show-indicators="false" :width="250" :height="30">
            <van-swipe-item class="carousel-item" v-for="(item,index) in pageTopRollTipList" :key="index">
                  {{item.tip}}</van-swipe-item>
          </van-swipe>
        </div>
        <p class="maximum">可用额度 （元）</p>
        <div class="msg-box">
          <p class="num">{{(borrowing.lineCredit/100).toFixed(2)}}</p>
          <CountDown :endTime="exprDate" v-if="borrowing.state&&borrowing.state!=-1"/>
          <p style="color:red" v-if="!borrowing.state||borrowing.state==-1">当前额度已失效</p>
        </div>
        <div class="apply-for" @click="affirmClick">{{btnText}}</div>
      </div>
    </div>
    <!-- 20为借款处理中 -->
    <div v-if="borrowing.state==20||borrowing.state==1">
      <div class="header">
        <img class="icon" src="../../../assets/chuli.png" alt="" />
        <p class="InTheReview">借款处理中，请耐心等待</p>
      </div>
      <div class="box">
        <van-cell-group class="list">
          <van-cell class="text-left" title="到账金额" :value="'￥'+(borrowing.lineCredit/100).toFixed(2)"/>
          <van-cell class="text-left" title="收款账户" :value="(borrowing.bankCardDto).sortName"/>
          <van-cell class="text-left" title="借款期限" :value="borrowing.term"/>
          <van-cell class="text-left" title="首期应还" :value="`￥${(borrowing.terminallyRepayMoney/100).toFixed(2)}`"/>
        </van-cell-group>
      </div>
    </div>
    </van-pull-refresh>
  </div>
</template>

<script>
  import CountDown from '@/components/CountDown.vue'
  import { Swipe, SwipeItem,Toast,Cell, CellGroup,PullRefresh,Dialog,NavBar } from 'vant';
  var  timer=0;
  export default {
    components: {
      [Swipe.name]:Swipe,
      [SwipeItem.name]:SwipeItem,
      [Toast.name]:Toast,
      CountDown,
      [Cell.name]:Cell,
      [CellGroup.name]:CellGroup,
      [PullRefresh.name]:PullRefresh,
      [Dialog.name]:Dialog,
      [NavBar.name]:NavBar,
    },
    data(){
      return{
        isLoading:false,//下拉刷新
        adDate:[],//广告轮播数据
        exprDate:'',//倒计时
        pageTopRollTipList:'',//轮播信息
        borrowing:'',
        btnText:'立即提现',
        _hmtState:true
      }
    },
    destroyed(){
      if(timer) { //如果定时器在运行则关闭
          clearInterval(timer);
      }
    },
    mounted(){
      _hmt.push(['_trackPageview', '/dzhome']);
      this.$util.goBack(Dialog,'false');

      let _this = this;
      // 获取本地数据
      this.$util.getUser().then(token=>{
        _this.token=token;
        _this.ad();
        _this.pageTopRollTip();
        // _this.loginState();
        _this.borrowingSchedule();
        if(token!='-1'){
          // 贷中进度查询

          _this.$util.appVersion(token,Dialog)
        }
      })
    },
    methods: {
      aHref(url,title){
        this.$util.nativeHeader(url,title)
      },
      onRefresh() {
        this.borrowingSchedule('onRefresh')
      },
      // 轮播图
      ad(){
        let _this = this;
        this.$api.get('/ad/v1/list?adGroupCode=homeHead&pageNum=1&pageSize=10',{},s=>{
          // console.log(s)
          this.adDate = s.module.list;
        },f=>{
          Toast(f.errorMessage)
        },{
          'Accept': 'application/json',
          'channelCode':this.$util.channelCode,
          'version':this.$util.version,
          'token':this.token
        })
      },
      // 信息轮播
      pageTopRollTip(){
        let _this = this;
        this.$api.get('/sys/v1/pageTopRollTip',{},s=>{
          _this.pageTopRollTipList = s.module;
        },f=>{
          if(f.resultCode=='10000'||f.resultCode=='10003'||f.resultCode=='10001'||f.resultCode=='10002'){
            _this.$util.url('/HomeBefore','首页')
          }else{
            Toast(f.errorMessage);
          }
        },{
          'Accept': 'application/json',
          'channelCode':this.$util.channelCode,
          'version':this.$util.version,
          'token':this.token
        })
      },
      // 进度查询
      borrowingSchedule(onRefresh){
        let _this = this;
        clearInterval(timer)
        this.$api.get('/borrowing/v1/borrowingSchedule?bankrollCode='+this.$util.bankrollCode,{},s=>{
            if(onRefresh){
              Toast('刷新成功');
              _this.isLoading = false;
            }
            _this.$util.setSaveVlues('desc','')//清除认证返回状态
            _this.borrowing = s.module;
            _this.exprDate = s.module.exprDate
            if(_this.borrowing.state==0||_this.borrowing.state==-1){
                _this.btnText = '立即激活';
            }else{
                _this.btnText = '立即提现';
            }
          // 审核中定时刷新页面更新状态
          if(s.module.state==20){
            if(_this._hmtState){
              _this._hmtState=false;
              _hmt.push(['_trackPageview', '/dzsh']);
            }
            timer=setInterval(() => {
              _this.borrowingSchedule();
            }, 5000)
          }
          if(s.module.state==30){
           _this.$util.url('/HomeAfter','首页')
          }
          if(s.module.state==40){
           _this.borrowBeforeSchedule()
          }
          },f=>{
              if(f.resultCode=='10000'||f.resultCode=='10003'||f.resultCode == '20015'||f.resultCode=='10001'||f.resultCode=='10002'){
                _this.$util.url('/HomeBefore','首页')
              }else{
                Toast(f.errorMessage);
              }
            // }
          },{
          'Accept': 'application/json',
          'channelCode':this.$util.channelCode,
          'version':this.$util.version,
          'token':this.token
        })
      },
      borrowBeforeSchedule(){
         let _this = this;
        this.$api.get('/borrowBefore/v1/borrowBeforeSchedule?bankrollCode='+this.$util.bankrollCode,{},s=>{
          console.log(s);
          switch (s.module.step) {
            case 10:
              //未开始，跳转 基本信息
              _this.$util.url('/basicInfo','基本信息')
              // this.$router.push({ path: '/basicInfo'})
              break;
            case 20:
              //基本信息完成，跳转 联系人信息
              _this.$util.url('/contactInfo','联系人信息')
              // this.$router.push({ path: '/contactInfo'})
              break;
            case 30:
              //联系人信息完成，跳转 身份证认
              _this.$util.url('/identityInfo','身份信息')
              // this.$router.push({ path: '/identityInfo'})
              break;
            case 40:
              //身份证认完成，跳转 人脸认证
              _this.$util.url('/FaceRecognition','人脸识别')
              // this.$router.push({ path: '/FaceRecognition'})
              break;
            case 50:
              //人脸认证完成，跳转 运营商认证
              // 三方页面
              _this.applyBorrowMoney()
              break;
            case 60:
              // 全部完成怎么跳转？
              break;
            case 61:
            // 重新认证
              _this.$util.h5Authenticate(s.module.orderNo);
              break;

            default:
              break;
          }




        },f=>{

          if(f.resultCode=='10003'||f.resultCode=='10000'||f.resultCode=='10001'||f.resultCode=='10002'){

          }else{
            Toast(f.errorMessage)
          }
        },{
          'Accept': 'application/json',
          'channelCode':this.$util.channelCode,
          'version':this.$util.version,
          'token':this.token
        })
      },
      //提现 或 激活
      affirmClick(){
        let _this = this;
        // console.log(0)
        // 0=已过期 10=生效中未借款,20=放款中，30=放款成功,1=审核中,-1=审核失败,40=可重新申请，
        this.$api.get('/borrowing/v1/borrowingSchedule?bankrollCode='+this.$util.bankrollCode,{},s=>{
           if(s.module.state==0||s.module.state==-1){
              Toast(`${s.module.remainingDays}天后才可以激活!`);
            }else if(s.module.state==40){
              //激活逻辑 获取订单号重新发起h5认证
              _this.applyBorrowMoney()
            }else{
              //填写信息
              _this.$util.url('/loanApplication','确认借款页')
            }
          },f=>{
              if(f.resultCode=='10000'||f.resultCode=='10003'||f.resultCode == '20015'||f.resultCode=='10001'||f.resultCode=='10002'){
                _this.$util.url('/HomeBefore','首页')
              }else{
                Toast(f.errorMessage);
              }
          },{
          'Accept': 'application/json',
          'channelCode':this.$util.channelCode,
          'version':this.$util.version,
          'token':this.token
        })

      },
      //
      applyBorrowMoney(){
        this.$api.post('/borrowBefore/v1/applyBorrowMoney?bankrollCode='+this.$util.bankrollCode,{},s=>{
          console.log(s)
          let orderNo = s.module.orderNo;
          _this.$util.h5Authenticate(orderNo);
        },f=>{
          if(f.resultCode=='20007'){
            // _this.generateOperatorAuthOrderNo()
          }else if(f.resultCode=='20012'){
            Toast('获取三方认证失败，请重试！');

          }else if(f.resultCode=='20013'){
            Toast('审核失败');
            _this.$util.url('/HomeBefore','首页')
          }else{

            // _this.h5Authenticate();
            if(f.resultCode=='10000'||f.resultCode=='10003'||f.resultCode=='10001'||f.resultCode=='10002'){
              _this.$util.url('/HomeBefore','首页')
            }else{
              Toast(f.errorMessage);
            }
          }
        },{
          'Accept': 'application/json',
          'channelCode':this.$util.channelCode,
          'version':this.$util.version,
          'token':this.token
        })
      }
    }

  }
</script>

<style>
.van-swipe{
  overflow:inherit ;
}
/* .van-swipe__indicators {
    bottom:-20px
} */
</style>
<style scoped lang="scss">
.homeBefore{
  width:100%;
  height:100%;
  font-size:0.28rem;
}
.my-swipe{
    overflow: hidden;
    width:349px;
    height:130px;
    border-radius:15px;
    margin:13px auto;
    box-shadow: 0px 0px 10px 2px #E6E6E6;
}
.core-function{
    position:relative;
    display:flex;
    flex-direction: column;
    align-items:center;
    width:349px;
    height:248px;
    margin:30px auto 10px;
    border-radius:8px;
    box-shadow: 0px 0px 10px 2px #E6E6E6;
  }
  .hint{
    position:absolute;
    left:0;
    top:0;
    width:100%;
    display: flex;
    flex-direction: row;
    justify-content:center;
    align-items: center;
    margin-top:15px;
    line-height:20px;
    font-size:12px;
    color:#41424E;
  }
  .hint i{
    position:relative;
    top:-3px;
  }
  .icon-laba:before {
    position:relative;
    top:5px;
    font-size:25px;
    color:#FF8024
   }
   .maximum{
     font-size:12px;
     line-height:30px;
     margin-top:62px;
     color:#41424E;
   }
   .msg-box{
     height:80px;
   }
   .num{
     font-size:55px;
     font-weight:600;
     line-height:50px;
     color:#1D0F00;
   }
   .timer{
     color:red;
   }
   .apply-for{
     width:239px;
     height:46px;
     line-height:46px;
     font-size:19px;
     border-radius:15px;
    background:#FF8024;
     color:#fff;
   }
   .carousel{
     overflow: hidden;
     width:250px;
     height:30px;
     margin-top:2px;
     line-height: 30px;
   }

   .header{
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      height:180px;
      background: #fff;
    }
    .icon{
      width:90px;
      height:73px;
    }
    .InTheReview{
      padding:0 30px;
      margin-top:10px;
      text-align: left;
      font-size:15px;
      font-weight: 600;
      color:#333;
    }
    .box{
      overflow: hidden;
      width:90%;
      margin:15px auto 0;
      border-radius: 4px;
      box-shadow: 0 3px 9px 3px rgba(0,0,0,0.10);
    }
</style>